<template>
	<div class="common-layout">
	   <el-container>
	     <el-header><Header></Header></el-header>
	     <el-main>
			<div>
			 <h3>积分规则</h3>
			 <el-table :data="tableData" style="width: 100%">
			 	<el-table-column prop="userAccount" label="规则名称" style="width: 25%;" />
			 	<el-table-column label="规则详情" style="width: 25%;" >
			 	</el-table-column>
				<el-table-column prop="" label="是否启用"  style="width: 25%;"  />
				<el-table-column label="操作"  style="width: 25%;" >
					<template #default="opt">
						<span class="mya">配置</span>
					</template>
				</el-table-column>
			 </el-table>
	
			 <!-- 点击标签显示框 -->
			 <el-dialog v-model="dialogFormVisible1" title="规则配置" width="500">
			     <el-form :model="formtwo">
			       <el-form-item label="会员注册">
						<el-button>开/关</el-button>
			       </el-form-item>
					<div>
						发放<el-input></el-input>积分
					</div>
			     </el-form>
				 
			     <template #footer>
			       <div class="dialog-footer">
			         <el-button @click="dialogFormVisible1 = false">取消</el-button>
			         <el-button type="primary" @click="sure">
			           确定
			         </el-button>
			       </div>
			     </template>
			   </el-dialog>
			 
			 
			<el-pagination
			 	layout="prev,pager,next"
			 	:page-count="total"
			 	:page-size="pageSize"
			 	v-model:current-page="pageIndex"	
			 	@current-change="changePage"
			 ></el-pagination>
			</div>
		 </el-main>
	   </el-container>
	 </div>
	
</template>

<script setup>
	import Header from '@/components/Header.vue'
	import { ref,reactive,onMounted} from 'vue'
	// import {} from "@/api"
	import VipDetails from '@/components/VipDetails.vue';
	let pageIndex=ref(1);
	let pageSize=10;
	let total=ref(0)
	const tableData = ref([])
	const options = ref([])
	//获取会员积分模块会员列表
	const getScoreList = async ()=>{
		let res=await VipScoreList({
			pageIndex:pageIndex.value,
			pageSize:pageSize,
			siteId:Number(sessionStorage.getItem("siteId")),
		})
		// console.log("会员列表",res)
		tableData.value=res.userList
		total.value=res.pageCount
	}

	const dialogFormVisible1 = ref(false)
	const showTag = (row)=>{
		dialogFormVisible1.value=true;
	}
	//分页
	const changePage=(page)=>{
		pageIndex.value=page;
		getScoreList()
	}
	
	onMounted(()=>{
		
	})
</script>

<style lang="less" scoped>
	.el-button{
		margin-left: 15px;
	}
	.el-input__wrapper{
		margin-right:15px;
	}
	h3{
		margin-left: 50px;
		margin-bottom: 20px;
		margin-top: 20px;
	}
	.el-table{
		width: 100vh;
	}
	
	.demonstration{
		margin-right: 12px;
	}
	.common-layout{
		background: #f2f3f5;
		.el-header{
			padding:0 !important;
			height: 10vh;
		}
		.el-main{
			height: 86vh;
			padding:0;
			width: 98%;
			background: #fff;
			margin: 10px auto;
		}
	}
	.mya{
		display: inline-block;
		color: #4b5db9;
		width: 50px;
		text-align: center;
	}
</style>